<template>
<view class="page__bd">
	<custom-navbar bgColor="bg-white shadow" :isBack="true" :isHome="true">
		<block slot="backText">返回</block>
		<block slot="content">文章列表</block>
	</custom-navbar>
	<block v-for="(item,index) in articleList" :key="index">
		<view class="daui-media daui-media_appmsg daui-media_product" v-if="item.show_type == 2" @tap="openArticleDetail(item.id)">
			<view class="daui-media__bd">
				<view class="grid flex-sub col-3 grid-square">
					<view class="bg-img">
						<image :src="item.picurl"></image>
					</view>
					<view class="bg-img">
						<image :src="item.picurl2"></image>
					</view>
					<view class="bg-img">
						<image :src="item.picurl3"></image>
					</view>
				</view>
				<view class="daui-media__newstitle">{{item.title}}</view>
				<view class="flex text-grayDark margin-top-xs">
					<view class="flex-sub">
						{{item.cate_name}}
					</view>
					<view>
						{{item.autotime}}
					</view>
				</view>
			</view>
		</view>
		<view class="daui-media daui-media_appmsg daui-media_product" v-else @tap="openArticleDetail(item.id)">
			<view class="daui-media__hd" v-if="item.picurl">
				<view class="daui-media__banner">
					<image :src="item.picurl" mode="widthFix"></image>
				</view>
			</view>
			<view class="daui-media__bd">
				<view class="daui-media__title">{{item.title}}</view>
				<view class="flex text-grayDark margin-top-xs">
					<view class="flex-sub">
						{{item.cate_name}}
					</view>
					<view>
						{{item.autotime}}
					</view>
				</view>
			</view>
		</view>
	</block>
	<view class="daui-load" :class="!loadding?'loading':'over'"><view class="daui-load-in"><view class="daui-nomore-text"></view></view></view>
	
	<!--toast提示-->
	<daui-toast ref="toast"></daui-toast>
</view>
</template>

<script>
import danceuiTool from '../../utils/danceuiTool';
import http from "../../server/api-index.js";
export default {
	data() {
		return {
			list_param:{
				p:1
			},
			nowPage:1,
			loadding: false,
			pullUpOn: true,
			articleList: [],
			cid: 0,
			scrollTop: 0
		}
	},
	onLoad(options) {
		console.log('onLoad的参数:', options);
		this.cid = options.cid;
		this.list_param = {...this.list_param,cid:this.cid}
		this.getData();
	},
	onPullDownRefresh() {
		console.log('=====上拉刷新refresh');
		this.list_param = {...this.list_param,p:1}
		this.getData();
		setTimeout(() => {
			uni.stopPullDownRefresh()
		}, 200);
	},
	async onReachBottom() {
		console.log('=====拉到底部onReachBottom');
		if (!this.pullUpOn) return;
		this.loadding = true;
		const token = uni.getStorageSync('token');
		let headers = {"Authorization":"Bearer "+token};
		this.list_param = {...this.list_param,p:++this.nowPage}
		let ret = await http.articleList(this.$refs.toast, this.list_param, headers);
		var retData = ret.data;
		if(retData.articleList){
			this.articleList = [...this.articleList,...retData.articleList];
			this.nowPage = this.nowPage + 1;
		}else{
			this.loadding = false;
			this.pullUpOn = false;
		}
	},	onPageScroll(e) {		this.scrollTop = e.scrollTop;	},
	methods: {
		async getData() { //请求并获取数据
			const token = uni.getStorageSync('token');
			let headers = {"Authorization":"Bearer "+token};
			let ret = await http.articleList(this.$refs.toast, this.list_param, headers);
			var retData = ret.data;
			console.log('myAdvice页面,获取到的数据：', retData);
			this.articleList = retData.articleList;
			this.loadding = true;
		},
		openArticleDetail(arid) {
			uni.navigateTo({
				url: '/pages/article/articleDetail?arid='+arid
			})
		}
	},
	onReachBottom() {
		//只是测试效果，逻辑以实际数据为准
		this.loadding = true
		this.pullUpOn = true
		setTimeout(() => {
			this.loadding = false
			this.pullUpOn = false
		}, 1000)
	},
	onPageScroll(e) {
		this.scrollTop = e.scrollTop;
	}
}
</script>

<style>
</style>
